<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
      layout:decorator="gis/gis_layout">

<head>
    <title>地图绘制</title>
</head>

<body class="gis gis-map-draw">

<div layout:fragment="content">
    <div id="map" class="map"></div>

    <div class="panel panel-primary area-info dn">
        <div class="panel-heading">
            框选区域信息
        </div>
        <div class="panel-body">
            <form class="form-horizontal">
                <div class="form-group">
                    <label class="col-sm-4 control-label">经纬度序列</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="lngLatList" readonly>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-4 control-label">中心点经纬度</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="centerPoint" readonly>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-4 control-label">面积</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="areaValue" readonly>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-4 control-label">地图缩放级别</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="zoom" readonly>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-4 control-label">归属地市</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="city" readonly>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-4 control-label">归属区县</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="district" readonly>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-4 control-label">中心点地址</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="address" readonly>
                    </div>
                </div>
            </form>
        </div>
        <div class="panel-footer text-right">
            <button class="btn btn-primary btn-sm" onclick="saveAreaInfo()">保存</button>
            <button class="btn btn-default btn-sm" onclick="clearAreaInfo()">清空</button>
            <button class="btn btn-default btn-sm btn-toggle" onclick="toggleAreaInfo()">折叠面板</button>
        </div>
    </div>

    <script th:replace="common/common_libs::commonjs"></script>
    <script src="/js/gis/map_draw.js"></script>
</div>

</body>
</html>